﻿<%@ Page Title="区域管理" Language="C#" MasterPageFile="~/master/m.master" %>
<script runat="server"></script>
<asp:Content ID="Content1" ContentPlaceHolderID="head" Runat="Server">
<link rel="stylesheet" href="../assets/css/replenishment/areaManage.css" />
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="main" Runat="Server">
<div class="system-box">
	<div class="right-side">
		<div class="btns-container"></div>
		<div class="right-content-box">
			<div class="content-container">
				<div class="header-tips">城市对应商品区域</div>
				<div class="control-box">
					<p>
						<span>商品区域：</span>
						<select id="commodity" class="form-control m-b select">
							<option value="">请选择</option>
						</select>
					</p>
					<p>
						<label class="left-title">备选城市列表</label>
						<label class="right-title">已选城市列表</label>
					</p>
				</div>
				<div class="chooseArea">
					<div class="leftArea1"></div>
					<div class="btnArea">
						<button class="btn btn-primary add add1" type="button">
							<i class="fa fa-long-arrow-right"></i>
                    	</button>
                    	<button class="btn btn-danger remove remove1" type="button">
							<i class="fa fa-long-arrow-left"></i>
                    	</button>
					</div>
					<div class="rightArea1"></div>
				</div>
			</div>
			
			<div class="content-container">
				<div class="header-tips">城市对应所属仓库</div>
				<div class="control-box">
					<p>
						<span>所属仓库：</span>
						<select id="warehouse" class="form-control m-b select">
							<option value="">请选择</option>
						</select>
					</p>
					<p>
						<label class="left-title">备选城市列表</label>
						<label class="right-title">已选城市列表</label>
					</p>
				</div>
				<div class="chooseArea">
					<div class="leftArea2"></div>
					<div class="btnArea">
						<button class="btn btn-primary add add2" type="button">
							<i class="fa fa-long-arrow-right"></i>
                    	</button>
                    	<button class="btn btn-danger remove remove2" type="button">
							<i class="fa fa-long-arrow-left"></i>
                    	</button>
					</div>
					<div class="rightArea2"></div>
				</div>
			</div>
			
		</div>
	</div>
</div>
</asp:Content>
<asp:Content ID="Content3" ContentPlaceHolderID="footer" Runat="Server">
<script src="../assets/js/plugins/footable/footable.all.min.js"></script>
<script src="../assets/js/page/tableControl.js"></script>
<script src="../assets/js/page/rScroll.js"></script>
<script>
$(document).ready(function(){
	//仓库列表
	//var warehouses = [
	//	{id: 'KM000874', name: '华中仓'},
	//	{id: 'KM000557', name: '郑州仓'},
	//	{id: 'KM000094', name: '太原仓'},
	//	{id: 'KM000894', name: '成都仓'},
	//	{id: 'KM000876', name: '湖南仓'},
	//	{id: 'KM000812', name: '武汉仓'},
	//	{id: 'KM000886', name: '西南仓'},
	//	{id: 'KM000875', name: '泛华北仓'},
	//	{id: 'KM000873', name: '华南仓'},
	//];
	//原有城市列表
	var oldList1 = [];
	var oldList2 = [];
	//模块ID
	var ModuleID = Y.getUrlParam("ModuleID");
	
	//获取按钮
	commonUtil.loadBtnList(ModuleID,function(){
		rScroll();
	});
	
	//初始化表头
	tableControl.initThead2('#cityTable',['城市','物流天数']);
	//初始化下拉框
	//商品区域
	commonUtil.bindDwGlobalVariables({dictValue: '商品区域'},['#commodity']);
	//仓库
	//warehouses.map(function(item){
	//	$('#warehouse').append('<option value="'+ item.id +'">'+ item.name +'</option>');
    //})
	commonUtil.bindOdsErpBasStocks({ StockID: 'StockID' }, ['#warehouse']);
	
	//计算省份下的城市数量
	var cityCount = function(el){
		$(el + ' .province').each(function(){
			var cityNum = $(this).next().find('.city').size();
			$(this).find('.cityNum').text('（'+ cityNum +'）');
		})
	}
	
	var bindList = function(data,el,screen){
		var html = '';
		data.map(function(item){
			html += '<div class="province">';
//			html += 	'<i class="fa fa-caret-down"></i>';
			html += 	'<i class="fa fa-caret-right"></i>';
			html += 	'<input type="checkbox" class="provinceCheck" />';
			html += 	'<input type="hidden" class="provinceId" value="'+ item[0].ParentID +'" />';
			html += 	'<span>'+ item[0].ParentName +'</span>';
			html += 	'<span class="cityNum"></span>'
			html += '</div>';
			html += '<div class="cityList">';
			item.map(function(city){
//				if(!city.IsChoose || !screen){
					html += '<div class="city">';
					html += 	'<input type="checkbox" class="cityCheck" />';
					html += 	'<input type="hidden" class="pId" value="'+ item[0].ParentID +'" />';
					html += 	'<input type="hidden" class="cityId" value="'+ city.AreaID +'" />';
					html += 	'<span>'+ city.AreaName +'</span>';
					html += '</div>';
//				}
			})
			html += '</div>';
		})
		$(el).append(html);
		cityCount(el);
	}
	
	//获取左边城市列表（商品区域）
	//type 1是商品区域，2是仓库
	//init 是否为初始
	var loadLeftList = function(type,init){
		leftEdit = false;
		layer.msg('玩命加载中……', {icon: 16, shade: 0.5, time:0, maxWidth:200});
		Y.API2('OdsErpBasArea','GetAllOdsBasAreaList',{
			Param: type
		},function(data){
			$('.leftArea' + type).empty();
			if(data.Success == false){
				layer.closeAll('dialog');
				swal(data.Message,'','error');
			}else{
				leftEdit = true;
				bindList(data,('.leftArea' + type),true);
				if(!init){
					loadRightList(type, (type == 1 ? $('#commodity').val() : $('#warehouse').val() ));
				}else{
					if(type == 2)
						layer.closeAll('dialog');
					else
						loadLeftList(2,true);
				}
			}
		})
	}
	loadLeftList(1,true);
	
	//获取右边城市列表
	var loadRightList = function(type,districtID){
		rightEdit = false;
		$('.rightArea' + type).empty();
		Y.API2('OdsErpBasArea','GetOdsErpBasAreaList',{
			Param: type,
			DistrictID: districtID,
		},function(data){
			layer.closeAll('dialog');
			if(data.Success == false){
				swal(data.Message,'','error');
			}else{
				rightEdit = true;
				bindList(data,('.rightArea' + type),false);
				//存储原有城市
				if(type == 1)
					oldList1 = [];
				else if(type == 2)
					oldList2 = [];
				else
					return false;
					
				$('.rightArea'+ type +' .city').each(function(){
					if(type == 1)
						oldList1.push($(this).find('.cityId').val());
					else if(type == 2)
						oldList2.push($(this).find('.cityId').val());
					else
						return false;
				})
			}
		})
	}
	
	//选择商品区域
	$('#commodity').change(function(){
		if($(this).val() == '')
			$('.rightArea1').empty();		
		else
			loadLeftList(1,false);
	})
	
	//选择仓库
	$('#warehouse').change(function(){
		if($(this).val() == '')
			$('.rightArea2').empty();		
		else
			loadLeftList(2,false);
	})
	
	//选择省份
	$('.leftArea1').on('click','.provinceCheck',function(){
		if(this.checked)
			$(this).parents('.province').next().find('.cityCheck').each(function(){this.checked=true;});
		else
			$(this).parents('.province').next().find('.cityCheck').each(function(){this.checked=false;});
	});
	$('.rightArea1').on('click','.provinceCheck',function(){
		if(this.checked)
			$(this).parents('.province').next().find('.cityCheck').each(function(){this.checked=true;});
		else
			$(this).parents('.province').next().find('.cityCheck').each(function(){this.checked=false;});
	});
	
	$('.leftArea2').on('click','.provinceCheck',function(){
		if(this.checked)
			$(this).parents('.province').next().find('.cityCheck').each(function(){this.checked=true;});
		else
			$(this).parents('.province').next().find('.cityCheck').each(function(){this.checked=false;});
	});
	$('.rightArea2').on('click','.provinceCheck',function(){
		if(this.checked)
			$(this).parents('.province').next().find('.cityCheck').each(function(){this.checked=true;});
		else
			$(this).parents('.province').next().find('.cityCheck').each(function(){this.checked=false;});
	});
	
	//选择城市
	var chooseCity = function(el){
		var container = el.parents('.cityList');
		if(container.find('.cityCheck').size() == container.find('.cityCheck:checked').size())
			container.prev().find('.provinceCheck').prop("checked", true);
		else
			container.prev().find('.provinceCheck').prop("checked", false);
	}
	$('.leftArea1').on('click','.cityCheck',function(){
		chooseCity($(this));
	});
	$('.rightArea1').on('click','.cityCheck',function(){
		chooseCity($(this));
	});
	$('.leftArea2').on('click','.cityCheck',function(){
		chooseCity($(this));
	});
	$('.rightArea2').on('click','.cityCheck',function(){
		chooseCity($(this));
	});
	
	//展开城市列表
	$('.leftArea1').on('click','.fa-caret-right',function(){
		$(this).parents('.province').next().show();
		$(this).addClass('fa-caret-down').removeClass('fa-caret-right');
	})
	$('.rightArea1').on('click','.fa-caret-right',function(){
		$(this).parents('.province').next().show();
		$(this).addClass('fa-caret-down').removeClass('fa-caret-right');
	})
	$('.leftArea2').on('click','.fa-caret-right',function(){
		$(this).parents('.province').next().show();
		$(this).addClass('fa-caret-down').removeClass('fa-caret-right');
	})
	$('.rightArea2').on('click','.fa-caret-right',function(){
		$(this).parents('.province').next().show();
		$(this).addClass('fa-caret-down').removeClass('fa-caret-right');
	})
	//折叠城市列表
	$('.leftArea1').on('click','.fa-caret-down',function(){
		$(this).parents('.province').next().hide();
		$(this).addClass('fa-caret-right').removeClass('fa-caret-down');
	})
	$('.rightArea1').on('click','.fa-caret-down',function(){
		$(this).parents('.province').next().hide();
		$(this).addClass('fa-caret-right').removeClass('fa-caret-down');
	})
	$('.leftArea2').on('click','.fa-caret-down',function(){
		$(this).parents('.province').next().hide();
		$(this).addClass('fa-caret-right').removeClass('fa-caret-down');
	})
	$('.rightArea2').on('click','.fa-caret-down',function(){
		$(this).parents('.province').next().hide();
		$(this).addClass('fa-caret-right').removeClass('fa-caret-down');
	})
	
	//添加城市
	$('.add').click(function(){
		var type = 0;
		if($(this).hasClass('add1')){
			//区域管理部分
			type = 1;
			if($('#commodity').val() == ''){
				swal('请选择商品区域');
				return false;
			}
		}else if($(this).hasClass('add2')){
			//仓库部分
			type = 2;
			if($('#warehouse').val() == ''){
				swal('请选择仓库');
				return false;
			}
		}else{
			return false;
		}
		
		if($('.leftArea'+ type +' .cityCheck:checked').size() == 0){
			swal('至少要选择一个城市');
			return false;
		}
		
		$('.leftArea'+ type +' .cityCheck:checked').each(function(){
			var provinceObj = $(this).parents('.cityList').prev();
			var cityObj = $(this).parents('.city');
			var pId = cityObj.find('.pId').val();
			var count = 0;
			//检测是否存在对应的省份节点
			$('.rightArea'+ type +' .province').each(function(){
				if($(this).find('.provinceId').val() == pId)
					count = -1;
				count++;
			});
			if(count == $('.rightArea'+ type +' .province').size()){
				$('.rightArea'+ type).append(provinceObj.clone(true));
				$('.rightArea'+ type +' .fa:last').removeClass('fa-caret-down').addClass('fa-caret-right');
				$('.rightArea'+ type).append('<div class="cityList"></div>');
			}
			//添加转移城市节点
			$('.rightArea'+ type +' .province').each(function(){
				if($(this).find('.provinceId').val() == pId){
					$(this).next().append(cityObj);
					$(this).find('.provinceCheck').prop("checked", false);
					$(this).next().find('.cityCheck:last').prop("checked", false);
				}
			});
		})
		cityCount('.leftArea' + type);
		cityCount('.rightArea' + type);
	});
	
	//移除城市
	$('.remove').click(function(){
		var type = 0;
		if($(this).hasClass('remove1')){
			//区域管理部分
			type = 1;
			if($('#commodity').val() == ''){
				swal('请选择商品区域');
				return false;
			}
		}else if($(this).hasClass('remove2')){
			//仓库部分
			type = 2;
			if($('#warehouse').val() == ''){
				swal('请选择商品区域');
				return false;
			}
		}else{
			return false;
		}
		if($('.rightArea'+ type +' .cityCheck:checked').size() == 0){
			swal('至少要选择一个城市');
			return false;
		}
		$('.rightArea'+ type +' .cityCheck:checked').each(function(){
			var provinceObj = $(this).parents('.cityList').prev();
			var cityObj = $(this).parents('.city');
			var pId = cityObj.find('.pId').val();
			var count = 0;
			//检测是否存在对应的省份节点
			$('.leftArea'+ type +' .province').each(function(){
				if($(this).find('.provinceId').val() == pId)
					count = -1;
				count++;
			});
			if(count == $('.leftArea'+ type +' .province').size()){
				$('.leftArea'+ type).append(provinceObj.clone(true));
				$('.leftArea'+ type +' .fa:last').removeClass('fa-caret-down').addClass('fa-caret-right');
				$('.leftArea'+ type).append('<div class="cityList"></div>');
			}
			//添加转移城市节点
			$('.leftArea'+ type +' .province').each(function(){
				if($(this).find('.provinceId').val() == pId){
					$(this).next().append(cityObj);
					$(this).find('.provinceCheck').prop("checked", false);
					$(this).next().find('.cityCheck:last').prop("checked", false);
				}
			});
		})
		cityCount('.leftArea'+ type);
		cityCount('.rightArea'+ type);
	})
	
	//保存商品区域
	$('.btns-container').on('click','#saveRegion',function(){
		if($('#commodity').val() == ''){
			swal('请先选择商品区域');
			return false;
		}			
		layer.msg('玩命加载中……', {icon: 16, shade: 0.5, time:0, maxWidth:200});
		var submitList = [];
		$('.rightArea1 .cityId').each(function(){
			submitList.push($(this).val());
		})
		
		console.log(oldList1);
		console.log(submitList);
		console.log($('#commodity').val());
//		return false;
		Y.API2('OdsErpBasArea','ModifyOdsErpBasArea',{
			oldAreaCodeList: oldList1,
			AreaCodeList: submitList,
			DistrictID: $('#commodity').val()
		},function(data){
			layer.closeAll('dialog');
			if(data.Success == false){
				swal(data.Message,'','error');
			}else{
				swal('保存成功','','success');
			}
		})
	})
	
	//保存仓库
	$('.btns-container').on('click','#saveWarehouse',function(){
		if($('#warehouse').val() == ''){
			swal('请先选择仓库');
			return false;
		}	
		layer.msg('玩命加载中……', {icon: 16, shade: 0.5, time:0, maxWidth:200});
		var submitList = [];
		$('.rightArea2 .cityId').each(function(){
			submitList.push($(this).val());
		})
		
		Y.API2('OdsErpBasArea','ModifyOdsErpBasStock',{
			oldAreaCodeList: oldList2,
			AreaCodeList: submitList,
			StockID: $('#warehouse').val()
		},function(data){
			layer.closeAll('dialog');
			if(data.Success == false){
				swal(data.Message,'','error');
			}else{
				swal('保存成功','','success');
			}
		})
	})
})
</script>
</asp:Content>

